<template>
	<view class="container">
		<!-- 这里是滚动内容 -->
		<view class="content">
			<view class="list">
				<view class="item" @tap="tapitem(i)" :style="{marginTop:i.top?i.top:'1rpx'}" v-for="i in config">
					<view class="view">{{i.title}}</view>
					<view v-if="i.key!=='dockPhoto'">
						<view class="text" v-if="data[i.key]">{{data[i.key]}}</view>
						<view class="text" v-if="!(data[i.key])">空</view>
					</view>
					<view v-if="i.key=='dockPhoto'">
						<view v-if="getUrl(data[i.key])==null">
							<view class="text">空</view>
						</view>
						<view v-else-if="getUrl(data[i.key]).type=='Array'" v-for="url in getUrl(data[i.key]).data" style="display: inline-block;">
							<image :src="this.$baseUrl + url" alt="图" class="photoPreview" />
						</view>
						<view v-else>
							<image :src="this.$baseUrl + getUrl(data[i.key]).data" alt="点位图" class="photoPreview" />
						</view>
					</view>
				</view>
			</view>
		</view>
		<CompileButton @click="navigateToPage1()" style="left: 90%;"/>
		<AlarmButton @click="navigateToPage2(this.data.id)" style="left: 90%;bottom: 15%;"/>
		<DetailButton @click="navigateToPage3(this.data)" style="left: 90%;"/>
	</view>
</template>

<script>
	import uniIcons from '@dcloudio/uni-ui/lib/uni-icons/uni-icons';
	import CompileButton from '@/common/component/CompileButton.vue';
	import AlarmButton from '@/common/component/AlarmButton.vue';
	import DetailButton from '@/common/component/DetailButton.vue';
	export default {
		components: {
			uniIcons,CompileButton,AlarmButton,DetailButton
		},
		onLoad(options) {
			this.equipmentStr = decodeURIComponent(options.equipment);
			const equipment = JSON.parse(this.equipmentStr);
			this.data.id = equipment.id;
			this.data.equipmentId = equipment.equipmentId;
			this.data.equipmentName = equipment.equipmentName;
			this.data.type = equipment.type;
			this.data.typeName = equipment.typeName;
			this.data.clientName = equipment.clientName;
			if (equipment.systemId === 0) {
				this.data.systemName = "电器火灾监测系统";
			} else if (equipment.systemId === 1) {
				this.data.systemName = "集中火灾报警控制器";
			}
			else if (equipment.systemId === 2) {
				this.data.systemName = "自动灭火系统";
			}
			else if (equipment.systemId === 3) {
				this.data.systemName = "消火栓系统";
			}
			else if (equipment.systemId === 4) {
				this.data.systemName = "安全疏散系统";
			}
			else if (equipment.systemId === 5) {
				this.data.systemName = "防烟排烟系统";
			}
            else if (equipment.systemId === 6) {
                this.data.systemName = "其他设备";
            }
			if (equipment.state === "0") {
				this.data.stateName = "正常";
			} else if (equipment.state === "1") {
				this.data.stateName = "报警";
			}
			else if (equipment.state === "2") {
				this.data.stateName = "故障";
			}
			else if (equipment.state === "3") {
				this.data.stateName = "屏蔽";
			}
			else if (equipment.state === "4") {
				this.data.stateName = "监管";
			}
			else if (equipment.state === "5") {
				this.data.stateName = "启动";
			}
			else if (equipment.state === "6") {
				this.data.stateName = "反馈";
			}
			else if (equipment.state === "7") {
				this.data.stateName = "延时";
			}
			else if (equipment.state === "8") {
				this.data.stateName = "主电故障";
			}
			else if (equipment.state === "9") {
				this.data.stateName = "备电故障";
			}
			else if (equipment.state === "10") {
				this.data.stateName = "总线故障";
			}
			else if (equipment.state === "11") {
				this.data.stateName = "手动状态";
			}
			else if (equipment.state === "12") {
				this.data.stateName = "配置改变";
			}
			else if (equipment.state === "13") {
				this.data.stateName = "复位";
			}
			this.data.online = equipment.online;
			if (equipment.online === "0") {
				this.data.onlineName = "在线";
			}
			else if (equipment.online === "1") {
				this.data.onlineName = "离线";
			}
			this.data.address = equipment.address;
			this.data.isExpire = equipment.isExpire;
			if (equipment.isExpire === "0") {
				this.data.isExpireName = "未过期";
			}
			else if (equipment.isExpire === "1") {
				this.data.isExpireName = "已过期";
			}
			this.data.startTime = equipment.startTime;
			this.data.endTime = equipment.endTime;
			this.data.inputTime = equipment.inputTime;
			this.data.price = equipment.price;
			this.data.deviceBindingSim = equipment.deviceBindingSim;
			this.data.simId = equipment.simId;
			this.data.updateTime = equipment.updateTime;
			this.data.manufactor = equipment.manufactor;
			this.data.manufactorPhone = equipment.manufactorPhone;
			this.data.salePrice = equipment.salePrice;
			this.data.equipmentModel = equipment.equipmentModel;
			this.data.heartbeatDuration = equipment.heartbeatDuration;
			this.data.protocolType = equipment.protocolType;
			this.data.addrMonitor = equipment.addrMonitor;
			this.data.dockHost = equipment.dockHost;
			this.data.dockPlace = equipment.dockPlace;
			this.data.dockType = equipment.dockType;
			this.data.dockPhoto = equipment.dockPhoto;
			this.data.operatorName = equipment.operatorName;
		},
		props: {
			config: {
				type: Array,
				default: [{
						title: '设备识别码',
						key: 'equipmentId'
					},
					{
						title: '设备名',
						key: 'equipmentName'
					},
					{
						title: '系统类型',
						key: 'systemName'
					},
					{
						title: '设备类型',
						key: 'typeName'
					},
					{
						title: '单位名称',
						key: 'clientName'
					},
					{
						title: '状态',
						key: 'stateName'
					},
					{
						title: '是否在线',
						key: 'onlineName'
					},
					{
						title: '安装地址',
						key: 'address'
					},
					{
						title: '是否过期',
						key: 'isExpireName'
					},
					{
						title: '服务起日期',
						key: 'startTime'
					},
					{
						title: '服务止日期',
						key: 'endTime'
					},
					{
						title: '入库时间',
						key: 'inputTime'
					},
					{
						title: '服务费',
						key: 'price'
					},
					{
						title: '是否绑定SIM卡',
						key: 'deviceBindingSim'
					},
					{
						title: 'SIM卡号',
						key: 'simId'
					},
					{
						title: '设备型号',
						key: 'equipmentModel'
					},
					{
						title: '修改时间',
						key: 'updateTime'
					},
					{
						title: '厂家',
						key: 'manufactor'
					},
					{
						title: '厂家电话',
						key: 'manufactorPhone'
					},
					{
						title: '销售价格',
						key: 'salePrice'
					},
					{
						title: '心跳时长(小时)',
						key: 'heartbeatDuration'
					},
					{
						title: '协议类型',
						key: 'protocolType'
					},
					{
						title: '监控地址',
						key: 'addrMonitor'
					},
					{
						title: '消控室对接主机',
						key: 'dockHost'
					},
					{
						title: '可对接场合',
						key: 'dockPlace'
					},
					{
						title: '对接方式',
						key: 'dockType'
					},
					{
						title: '对接图片',
						key: 'dockPhoto',
						type: 'img'
					},
					{
						title: '操作人',
						key: 'operatorName'
					},
				]
			},
			data: {
				type: Object,
				default: {
					id: '',
					equipmentId: '',
					equipmentName: '',
					type: '',
					typeName: '',
					systemName: '',
					clientName: '',
					state: '',
					stateName: '',
					online: '',
					onlineName: '',
					address: '',
					isExpire: '',
					isExpireName: '',
					startTime: '',
					endTime: '',
					inputTime: '',
					price: '',
					deviceBindingSim: '',
					simId: '',
					equipmentModel: '',
					updateTime: '',
					manufactor: '',
					manufactorPhone: '',
					salePrice: '',
					heartbeatDuration: '',
					protocolType: '',
					addrMonitor: '',
					dockHost: '',
					dockPlace: '',
					dockType: '',
					dockPhoto: '',
					operatorName: '',
				}
			}
		},
		data() {
			return {
				equipmentStr: '',
				tapitem(info) {
					console.log('info', info)
					this.$emit('')
				},
			};
		},
		methods: {
			getUrl(url){
				if(url==null){
					return null
				}
				const urlResult = {type:"String",data:""}
				if(url.includes(',')){
					const urlList = url.split(',')
					urlResult.type="Array"
					urlResult.data=urlList
					return urlResult
				}
				urlResult.data=url
				return urlResult
			},
			navigateToPage1() {
				uni.navigateTo({
					url: '/pages/equipment/compile?equipment=' + this.equipmentStr,
				});
			},
			navigateToPage2(id) {
				uni.navigateTo({
					url: '/pages/equipment/warn?id=' + id,
				});
			},
			navigateToPage3(data) {
				console.log(data.type)
				if (data.type === 52) {
					uni.navigateTo({
						url: '/pages/equipment/currentData?id=' + data.id + "&equipmentId=" + data.equipmentId,
					});
				} else if (data.type === 51) {
					uni.navigateTo({
						url: '/pages/equipment/fireCockSysData?id=' + data.id + "&equipmentId=" + data.equipmentId,
					});
				} else if (data.type === 42 || data.type === 46) {
					uni.navigateTo({
						url: '/pages/equipment/currentDq?id=' + data.id + "&equipmentId=" + data.equipmentId,
					});
				} else if (data.type === 53) {
					uni.navigateTo({
						url: '/pages/equipment/currentJh?id=' + data.id + "&equipmentId=" + data.equipmentId,
					});
				} else if (data.type === 44) {
					uni.navigateTo({
						url: '/pages/equipment/currentLs?id=' + data.id + "&equipmentId=" + data.equipmentId,
					});
				} else if (data.type === 45) {
					uni.navigateTo({
						url: '/pages/equipment/currentQg?id=' + data.id + "&equipmentId=" + data.equipmentId,
					});
				} else if (data.type === 43) {
					uni.navigateTo({
						url: '/pages/equipment/currentYg?id=' + data.id + "&equipmentId=" + data.equipmentId,
					});
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("@/common/globleCSS/photoPreview.css");
	.container {
		height: 100%;
		padding-bottom: constant(safe-area-inset-bottom);
		/* 适配iOS<11.2 */
		padding-bottom: env(safe-area-inset-bottom);
		/* 适配iOS>11.2 */
	}

	.content {
		height: 100%;
		/* 假设底部吸底栏高度为50px */
		overflow-y: auto;
		/* 开启滚动 */
	}

	.list {
		display: flex;
		flex-direction: column;
		background-color: #f2f2f2;
	}

	.item {
		display: flex;
		align-items: center;
		background-color: #fff;
		justify-content: space-between;
		flex-wrap: wrap;
		padding: 0 30rpx;

		&:active {
			background-color: #f2f2f2;
		}

		.view {
			padding: 30rpx 0;
			font-size: 14px;
			flex: 1;
			color: #333333;
		}

		.text {
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 0;
			overflow: hidden;
			font-size: 14px;
			color: #999;
		}
	}
</style>
